<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>地图展示</title>
    <script src="http://api.map.baidu.com/getscript?v=2.0&ak=ZUONbpqGBsYGXNIYHicvbAbM"></script>
    <script src="https://cdn.bootcss.com/echarts/4.1.0.rc2/echarts.min.js"></script>
    <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/extension/bmap.min.js"></script>
    <script src="./chart/devision.js"></script>
</head>
<style>
    body,html{
        margin: 0;
        padding: 0;
        width: 100%;
        font-size: 62.5%;
    }
    .parent{
        width: 100%;
    }
    .list{
        width: 100%;
        height: 3rem;
        background-color: #fff;
        padding: 0 0.625rem;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
    }
    .listItem{
        width: 100%;
        height: 3rem;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
    }
    .text{
        font-size: 0.9rem;
        font-family:NotoSansHans-Regular;
        color:rgba(151,151,151,1);
    }
    .icon{
        display: block;
        width: 0;
        height: 0;
        color: rgba(151,151,151,1);
        font-size: 0.625rem;
        border-bottom: 0.3rem solid #666;
        border-top: 0.3rem solid transparent;
        border-right: 0.3rem solid transparent;
        border-left: 0.3rem solid transparent;
        margin-left: 0.32rem;
    }
    #chart{
        width: 100%;
        height: 36rem;
    }
</style>
<body>
    <div class="parent">
        <ul class="list">
            <li class="listItem"><span class="text">查找村庄</span><span class="icon"></span></li>
            <li class="listItem"><span class="text">查找设施</span><span class="icon"></span></li>
            <li class="listItem"><span class="text">卫星图</span></li>
        </ul>
        <div id="chart"></div>
    </div>
</body>
</html>
<script src="./rem.js"></script>
    <script>
        var myChart = echarts.init(document.getElementById('chart'))
        myChart.setOption({
            bmap: {
                center: [116.46, 39.92],
                zoom: 10,
                roam: true
            },
            series: [{
                type: 'map',
                coordinateSystem: 'bmap',
                polyline: true,
                data: devision,
                silent: true,
                progressiveThreshold: 500,
                progressive: 200
            }]
        });
    </script>